﻿@using Aspire.Dashboard.Extensions
@using Aspire.Dashboard.Resources
@inject IStringLocalizer<ControlsStrings> Loc

<div class="@GetContainerClass()" style="width: inherit;">
    @if (EnableMasking && IsMasked)
    {
        <span class="cellText">
            &#x25cf;&#x25cf;&#x25cf;&#x25cf;&#x25cf;&#x25cf;&#x25cf;&#x25cf;
        </span>
    }
    else if (EnableHighlighting)
    {
        <span class="cellText" title="@(ToolTip ?? Value)">
            <FluentHighlighter HighlightedText="@HighlightText"
                               Text="@Value" />
            @ContentAfterValue
        </span>
    }
    else
    {
        <span class="cellText" title="@(ToolTip ?? Value)">
            @(MaxDisplayLength.HasValue ? TrimLength(Value) : Value)
            @ContentAfterValue
        </span>
    }
    @if (EnableMasking)
    {
        <FluentButton Appearance="Appearance.Lightweight"
                      IconEnd="@(IsMasked ? _unmaskIcon : _maskIcon)"
                      Title="@(IsMasked ? Loc[nameof(ControlsStrings.GridValueMaskShowValue)] : Loc[nameof(ControlsStrings.GridValueMaskHideValue)])"
                      OnClick="ToggleMaskStateAsync"
                      aria-label="@(IsMasked ? Loc[nameof(ControlsStrings.GridValueMaskShowValue)] : Loc[nameof(ControlsStrings.GridValueMaskHideValue)])" />
    }

    @{
        (string, object)[] uncapturedAttributes = [
            ("alt", PreCopyToolTip),
            ("title", string.Empty),
            ("aria-label", Loc[nameof(ControlsStrings.GridValueCopyToClipboard)]),
            ("tabindex", "0")
        ];
    }

    <FluentButton Appearance="Appearance.Lightweight"
                  Id="@_anchorId"
                  Class="defaultHidden"
                  Style="float: right; flex-shrink: 0"
                  AdditionalAttributes="@FluentUIExtensions.GetClipboardCopyAdditionalAttributes(ValueToCopy ?? Value, PreCopyToolTip, PostCopyToolTip, uncapturedAttributes)">
        <FluentIcon Class="copy-icon" Style="display:inline;" Icon="Icons.Regular.Size16.Copy" />
        <FluentIcon Class="checkmark-icon" Style="display:none;" Icon="Icons.Regular.Size16.Checkmark" />
    </FluentButton>
    <FluentTooltip @ref="_tooltipComponent" Anchor="@_anchorId" Position="TooltipPosition.Top" HideTooltipOnCursorLeave="true">@PreCopyToolTip</FluentTooltip>
</div>
